<template>
  <base-breadcrumb :title="$route.meta.title">
    <a-card :bordered="false">
      <a-tabs default-active-key="1" :activeKey="activeKey" @change="callback">
        <a-tab-pane v-for="(item, index) in tabs" :key="item.value" :tab="item.label">
          <searchData class="noshadow" :show-title-name="false" :search-data="item.searchData" @search="search" />

          <div class="table-operator">
            <a-button v-if="activeKey=='1'" v-btnPermission="[{code:'seex_pm_062_add_02',ident:'prma_seex'},{code:'buco_pm_062_add_02',ident:'prma_buco'}]" type="primary" @click="handleOperation('add')">新增</a-button>
            <a-button v-if="activeKey=='2'" v-btnPermission="[{code:'seex_pm_062_add_07',ident:'prma_seex'},{code:'buco_pm_062_add_07',ident:'prma_buco'}]" type="primary" @click="handleOperation('add')">新增</a-button>
            <a-button v-if="activeKey=='3'" v-btnPermission="[{code:'seex_pm_062_add_12',ident:'prma_seex'},{code:'buco_pm_062_add_12',ident:'prma_buco'}]" type="primary" @click="handleOperation('add')">新增</a-button>
          </div>
          <list-table
            :defaultLoad="true"
            :ref="`table${item.value}`"
            :page-keys="['currentPage', 'pageSize','totalSize']"
            size="default"
            rowKey="id"
            :columns="item.columns"
            :request="item.loadData"
            show-pagination="auto"
          >
            <span slot="serial" slot-scope="text, record, index">{{ index + 1 }}</span>
            <template slot="version" slot-scope="version, record">
                <span v-if="version < 1">--</span>
                <a v-else @click="handleVersionRecord(record)">
                    V{{ version }}
                </a>
            </template>
            <template slot="status" slot-scope="status, record, index">
                <span>
                    {{ stateName(status) }}
                </span>
            </template>

            <template slot="action" slot-scope="text, record, id">
              <MoreButton :key="id">
                <template v-if="activeKey==='1'">
                  <span v-btnPermission="[{code:'seex_pm_062_loo_01',ident:'prma_seex'},{code:'buco_pm_062_loo_01',ident:'prma_buco'}]">
                    <a @click="handleOperation('look', record)">查看</a>
                  </span>
                  <span v-if="record.status === 0" v-btnPermission="[{code:'seex_pm_062_edi_03',ident:'prma_seex'},{code:'buco_pm_062_edi_03',ident:'prma_buco'}]">
                    <a @click="handleOperation('edit', record)">编辑</a>
                  </span>
                  <span v-if="record.status === 1" v-btnPermission="[{code:'seex_pm_062_cha_05',ident:'prma_seex'},{code:'buco_pm_062_cha_05',ident:'prma_buco'}]">
                    <a @click="handleOperation('change', record)">变更</a>
                  </span>
                  <span v-if="record.status === 0" v-btnPermission="[{code:'seex_pm_062_del_04',ident:'prma_seex'},{code:'buco_pm_062_del_04',ident:'prma_buco'}]">
                    <a @click="handleOperation('del', record)">删除</a>
                  </span>
                </template>
                <template v-if="activeKey==='2'">
                  <span v-btnPermission="[{code:'seex_pm_062_loo_06',ident:'prma_seex'},{code:'buco_pm_062_loo_06',ident:'prma_buco'}]">
                    <a @click="handleOperation('look', record)">查看</a>
                  </span>
                  <span v-if="record.status === 0" v-btnPermission="[{code:'seex_pm_062_edi_08',ident:'prma_seex'},{code:'buco_pm_062_edi_08',ident:'prma_buco'}]">
                    <a @click="handleOperation('edit', record)">编辑</a>
                  </span>
                  <span v-if="record.status === 1" v-btnPermission="[{code:'seex_pm_062_cha_10',ident:'prma_seex'},{code:'buco_pm_062_cha_10',ident:'prma_buco'}]">
                    <a @click="handleOperation('change', record)">变更</a>
                  </span>
                  <span v-if="record.status === 0" v-btnPermission="[{code:'seex_pm_062_del_09',ident:'prma_seex'},{code:'buco_pm_062_del_09',ident:'prma_buco'}]">
                    <a @click="handleOperation('del', record)">删除</a>
                  </span>
                </template>
                <template v-if="activeKey==='3'">
                  <span v-btnPermission="[{code:'seex_pm_062_loo_11',ident:'prma_seex'},{code:'buco_pm_062_loo_11',ident:'prma_buco'}]">
                    <a @click="handleOperation('look', record)">查看</a>
                  </span>
                  <span v-if="record.status === 0" v-btnPermission="[{code:'seex_pm_062_edi_13',ident:'prma_seex'},{code:'buco_pm_062_edi_13',ident:'prma_buco'}]">
                    <a @click="handleOperation('edit', record)">编辑</a>
                  </span>
                  <span v-if="record.status === 1" v-btnPermission="[{code:'seex_pm_062_cha_15',ident:'prma_seex'},{code:'buco_pm_062_cha_15',ident:'prma_buco'}]">
                    <a @click="handleOperation('change', record)">变更</a>
                  </span>
                  <span v-if="record.status === 0" v-btnPermission="[{code:'seex_pm_062_del_14',ident:'prma_seex'},{code:'buco_pm_062_del_14',ident:'prma_buco'}]">
                    <a @click="handleOperation('del', record)">删除</a>
                  </span>
                </template>
              </MoreButton>
            </template>
          </list-table>
        </a-tab-pane>
      </a-tabs>
        <!-- 版本记录 -->
        <VersionRecord :visible.sync="versionVisible" :data="versionData" :activeKey="activeKey" />
    </a-card>
  </base-breadcrumb>
</template>

<script>

import { statusList2, searchOption, columns } from './model.js'
import { getStagePlanBySearch, deleteByPrimaryKey } from '@/api/project/phasedPlanning'
import VersionRecord from './components/VersionRecord'
export default {
  name: 'phasedPlanning',
  components: {
    VersionRecord
  },
  data() {
    return {
        statusList2,
        searchOption,
        columns,
        activeKey: null,
        versionVisible: false,
        versionData: null,
        queryParam1: {},
        queryParam2: {},
        queryParam3: {},
        loadData: (activeKey) => (parameter) => {
            let param = {
                planType: activeKey,
                ...this['queryParam'+activeKey]
            }
            const requestParameters = Object.assign({}, parameter, { query: param })
            return getStagePlanBySearch(requestParameters).then((res) => {
                return {code: 200, data: res.data, ...res }
            }).catch((err) => {
                return { code: 500, err }
            })
        },
    }
  },
  computed: {
    stateName() {
      return (val) => {
        return this.statusList2.find((v) => v.value == val)?.label
      }
    },
    isSelf() {
      return (val) => {
        return val.examineUserId == this.$userInfo()?.employee?.userId
      }
    },
    tabs() {
        let list = [
            {
                label: '开工策划',
                value: '1',
                searchData: this.searchOption,
                columns,
                loadData: this.loadData("1")
            },
            {
                label: '总承包阶段策划',
                value: '2',
                searchData: this.searchOption,
                columns,
                loadData: this.loadData("2")
            },
            {
                label: '竣工策划',
                value: '3',
                searchData: this.searchOption,
                columns,
                loadData: this.loadData("3")
            }
        ]
        return list
    }
  },
  beforeRouteEnter(to, from, next) {
    if (from.query.activeKey) {
      next((vm) => {
        vm.activeKey = from.query.activeKey
      })
    } else {
      next((vm) => {
        vm.activeKey = "1"
      })
    }
  },
  created() {
    console.log("created")
  },
  methods: {
    search(e) {
      let param = this.$clone(e)
      if (this.activeKey == '1') {
        this.queryParam1 = {
          ...param
        }
      } else if (this.activeKey == '2') {
        this.queryParam2 = {
          ...param
        }
      } else if (this.activeKey == '3') {
        this.queryParam3 = {
          ...param
        }
      }
      this.$refs[`table${this.activeKey}`] && this.$refs[`table${this.activeKey}`][0].refresh(true)
    },
    callback(e) {
      this.activeKey = e;
    },
    handleOperation(type, record = {}) {
      if (type == 'del') {
        this.delete(record)
        return
      }
      let { id, version } = record;
      let obj = {
        path: '/project/plannManagement/phasedPlanning/edit',
        query: {
          activeKey: this.activeKey,
          type,
          version
        }
      }
      if (id) obj.query.id = id
      this.$router.push(obj)
    },
    handleVersionRecord(record){
      this.versionVisible = true
      this.versionData = record
    },
    delete(e) {
      let that = this
      that.$confirm({
          title: '温馨提示',
          content: '确定是否删除数据？',
          okText: '确认',
          okType: 'danger',
          cancelText: '取消',
          onOk() {
            return deleteByPrimaryKey(e.id).then((res) => {
                  that.$message.success('删除成功！')
                  that.search()
              }).catch((err) => {
                  that.$message.warning('删除失败！')
              })
          },
      })
    },
  }
}
</script>

<style>
  .noshadow .ant-card{
    box-shadow: none
  }
</style>
